<!--<template>-->
<!--    <el-dialog :title="detailData.plate_no" :visible.sync="outerVisible" width="900px" append-to-body>-->
<!--        <div class="flex flex-direction ">-->
<!--            <div v-loading="detailLoading" class="flex">-->
<!--                <div class="flex-sub margin-right flex flex-direction">-->
<!--                    <el-form label-width="80px" size="mini">-->
<!--                        <el-form-item label="检测站点">{{ detailData.name }}</el-form-item>-->
<!--                        <el-form-item label="车道">{{ detailData.lane_no }}</el-form-item>-->
<!--                        <el-form-item label="方向">{{ detailData.directionName }}</el-form-item>-->
<!--                        <el-form-item label="过车时间">{{ moment(detailData.pass_time).format('YYYY-MM-DD HH:mm:ss') }}</el-form-item>-->
<!--                        <el-form-item label="车身颜色">{{ detailData.vehicle_color_name || detailData.vehicleColorName }}</el-form-item>-->
<!--                        <el-form-item label="车辆类型">{{ detailData.vehicleTypeName }}</el-form-item>-->
<!--                    </el-form>-->
<!--                </div>-->

<!--                <vehicle-media :detail-data="detailData" :show-video="showVideo" style="width: 50%;" />-->
<!--            </div>-->

<!--            <el-tabs v-model="queryParams.Parameter" class="margin-top-xs " @tab-click="handleTabClick">-->
<!--                <el-tab-pane label="24小时内超限数据" name="1" />-->
<!--                <el-tab-pane label="7日内超限数据" name="2" />-->
<!--                <el-tab-pane label="30天内超限数据" name="3" />-->
<!--            </el-tabs>-->

<!--            <el-table ref="orderTable" v-loading="isLoading" class="actionTable" stripe :data="tableData" size="mini"-->
<!--                      header-cell-class-name="table-header" style="width: 100%; margin-top: -15px;" max-height="200">-->
<!--                <el-table-column label="车牌号码" width="100" prop="plate_no" />-->
<!--                <el-table-column label="检测站点" width="180" prop="name" />-->
<!--                <el-table-column label="过车时间" width="200">-->
<!--                    <template slot-scope="scope">-->
<!--                        {{ moment(scope.row.pass_time).format('YYYY-MM-DD HH:mm:ss') }}-->
<!--                    </template>-->
<!--                </el-table-column>-->
<!--                <el-table-column label="车辆重量（吨）" width="150" prop="vehicle_weight" />-->
<!--                <el-table-column label="超重（吨）" width="100" prop="over_weight" />-->
<!--                <el-table-column label="操作" width="120" fixed="right" align="center">-->
<!--                    <template slot-scope="scope">-->
<!--                        <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)">查看详情</el-button>-->
<!--                    </template>-->
<!--                </el-table-column>-->
<!--            </el-table>-->
<!--            <div class="Pagination">-->
<!--                <el-pagination-->
<!--                    background-->
<!--                    layout="total, sizes,prev, pager, next,jumper"-->
<!--                    :current-page.sync="queryParams.CurrentPage"-->
<!--                    :page-size="20"-->
<!--                    :page-sizes="[20]"-->
<!--                    :total="totalCount"-->
<!--                    @current-change="handleCurrentChange" />-->
<!--            </div>-->
<!--        </div>-->
<!--    </el-dialog>-->
<!--</template>-->

<!--<script>-->
<!--import moment from 'moment';-->
<!--import VehicleMedia from './vehicle-media';-->

<!--import {OutOfLimitData, BayonetRecordQuery} from '@/api/informationApi';-->

<!--export default {-->
<!--    name: 'VehicleDetail',-->
<!--    components: {VehicleMedia},-->
<!--    props: {-->
<!--        initDetailData: Object,-->

<!--        showVideo: {-->
<!--            type: Boolean,-->
<!--            default: false-->
<!--        }-->
<!--    },-->
<!--    data() {-->
<!--        return {-->
<!--            outerVisible: false,-->
<!--            tableData: [],-->
<!--            totalCount: 0,-->
<!--            isLoading: false,-->
<!--            queryParams: {},-->
<!--            detailLoading: false,-->
<!--            localVehicleDetail: null,-->
<!--            mediaTab: 'img',-->
<!--            type: 'Limit'-->
<!--        };-->
<!--    },-->
<!--    computed: {-->
<!--        images() {-->
<!--            console.log(this.detailData);-->
<!--            let images = this.detailData.image_path;-->
<!--            if (images) {-->
<!--                return images.split(',');-->
<!--            }-->
<!--            return [];-->
<!--        },-->
<!--        detailData() {-->
<!--            return this.localVehicleDetail || this.initDetailData;-->
<!--        }-->
<!--    },-->
<!--    watch: {-->
<!--        initDetailData(val) {-->
<!--            this.localVehicleDetail = null;-->
<!--            this.queryParams = {-->
<!--                Parameter: '1',-->
<!--                CurrentPage: 1,-->
<!--                plate_no: val.plate_no-->
<!--            };-->
<!--            this.mediaTab = 'img';-->
<!--            this.loadRemoteData();-->
<!--        }-->
<!--    },-->
<!--    mounted() {-->

<!--    },-->
<!--    methods: {-->
<!--        moment,-->
<!--        show() {-->
<!--            this.outerVisible = true;-->
<!--        },-->
<!--        handleCurrentChange(val) {-->
<!--            this.queryParams.CurrentPage = val;-->
<!--            this.loadRemoteData();-->
<!--        },-->
<!--        handleTabClick() {-->
<!--            this.queryParams.CurrentPage = 1;-->
<!--            this.loadRemoteData();-->
<!--        },-->
<!--        handleView(item) {-->
<!--            this.detailLoading = true;-->

<!--            setTimeout(() => {-->
<!--                this.localVehicleDetail = item;-->
<!--                this.detailLoading = false;-->
<!--            }, 100);-->

<!--        },-->
<!--        loadRemoteData() {-->
<!--            this.isLoading = true;-->
<!--            BayonetRecordQuery(this.queryParams).then(res => {-->
<!--                this.isLoading = false;-->
<!--                console.log(res);-->
<!--                this.tableData = res.res.BayonetRecordQuery;-->
<!--                if (this.tableData && this.tableData.length > 0) {-->
<!--                    this.totalCount = this.tableData[0].totalCount;-->
<!--                }-->

<!--            }).catch(err => {-->
<!--                this.isLoading = false;-->
<!--                console.log(err);-->
<!--            });-->
<!--        },-->

<!--        handleDialogClosed() {-->

<!--        }-->
<!--    }-->
<!--};-->
<!--</script>-->

<!--<style scoped>-->

<!--/deep/-->
<!--.el-dialog__body {-->
<!--    padding: 10px 20px;-->
<!--}-->
<!--/deep/-->
<!--.el-dialog__header {-->
<!--    padding: 20px 20px 10px;-->
<!--    border-bottom: 1px solid #dcdfe6;-->
<!--}-->

<!--</style>-->
